<template>
  <a-modal
    :title="title"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @cancel="handleCancel"
    v-drag
  >
    <template slot="footer">
      <a-button @click="handleCancel">{{ $t('关闭') }}</a-button>
    </template>
    <a-spin :spinning="confirmLoading">
      <a-form :model="dataForm">
        <a-row>
          <a-col :span="20">
            <a-form-item
              style="margin-bottom: 10px"
              :label="$t('类型名称')"
              :labelCol="{ span: 5 }"
              :wrapperCol="{ span: 18 }"
            >
              <a-input v-model="dataForm.name"></a-input>
            </a-form-item>
          </a-col>
          <a-col :span="3">
            <a-button @click="add" type="primary">{{ $t('添加') }}</a-button>
          </a-col>
        </a-row>
        <a-table
          v-if="state==1"
          ref="table"
          size="middle"
          bordered
          rowKey="id"
          class="j-table-force-nowrap"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="false"
        >
          <template slot="action" slot-scope="text, record">
            <a-icon type="close" @click="deleteGoods(text, record)" />
          </template>
        </a-table>
      </a-form>
    </a-spin>
  </a-modal>
</template>

<script>
import { deleteAction, getAction, postAction } from '@/api/manage'

export default {
  name: 'EditOutTypeModal',
  data() {
    return {
      width: 500,
      visible: false,
      title: '',
      model: {},
      confirmLoading: false,
      dataForm: {
        name: '',
      },
      columns: [
        {
          title: this.$t('序号'),
          dataIndex: '',
          key: 'rowIndex',
          align: 'center',
          width: 100,
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: this.$t('类型名称'),
          dataIndex: 'name',
          align: 'center',
        },
        {
          title: this.$t('操作'),
          dataIndex: 'action',
          align: 'center',
          scopedSlots: { customRender: 'action' },
        },
      ],
      dataSource: [],
      state: 2,
      tenantId: '',
    }
  },
  methods: {
    edit(state, tId) {
      this.visible = true
      this.dataForm= {
        name: '',
      }
      if (tId === '') {
        this.tenantId = 0
        this.getList(0)
      } else {
        this.tenantId = ''
        this.getList()
      }
      this.state = state
    },
    getList(arg) {
      let query = {
        pageSize: 999,
      }
      if (arg === 0) {
        query.tenantId = arg
      }
      getAction('/goods/bisGoodsOutstockType/list', query).then((res) => {
        if (res.success) {
          this.dataSource = res.result.records
        }
      })
    },
    add() {
      if (this.dataForm.name == '') {
        this.$message.warning(this.$t('类型名称不能为空'))
        return
      }
      let aa = {
        name: this.dataForm.name,
      }
      postAction('/goods/bisGoodsOutstockType/add', aa).then((res) => {
        if (res.success) {
          this.$message.success(res.message)
          if (this.state==1) {
            if (this.tenantId === 0) {
              this.getList(0)
            } else {
              this.getList()
            }
          } else {
            this.close()
          }
        } else {
          this.$message.warning(res.message)
        }
      })
    },
    deleteGoods(a, b) {
      deleteAction('/goods/bisGoodsOutstockType/delete', { id: b.id }).then((res) => {
        if (res.success) {
          this.$message.success(res.message)
          this.getList()
        } else {
          this.$message.warning(res.message)
        }
      })
    },
    handleCancel() {
      this.close()
    },
    close() {
      this.visible = false
      this.$emit('ok',this.state)
    },
  },
}
</script>
<style>
.batchForm .ant-form-item-label {
  width: 30%;
}
.batchForm .ant-form-item-control-wrapper {
  width: 62.5%;
}
</style>